<template>
    <div>
        <div class="yejiListRow" v-for="item of clientList" :key="item.id">
            <div class="bidNameBox">
                <span class="line"></span>
                <span>{{item.truename}}</span>
                <span class="bidName">累计投资：{{item.totalInvestMoney}}</span>
                <!-- <span class="pull-right">2017.07.03起息</span> -->
            </div>
            <div class="bidNamePrice">
                <div>
                    <span>{{item.availableInvestMoney}}</span>
                    <p>账户余额</p>
                </div>
                <span class="line"></span>
                <div class="color">
                    <span>{{item.totalInvestMoneyOfCurrMonth}}</span>
                    <p>当月投资</p>
                </div>
                <span class="line"></span>
                <div>
                    <span>{{item.totalInvestMoney}}</span>
                    <p>累计充值</p>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    props: ["clientList"]
}
</script>

<style>
.yejiListRow {
    height: 1.95rem;
    margin-bottom: .3rem
}

.bidNameBox {
    height: .8rem;
    /* line-height: .8rem; */
    padding-right: .25rem;
    border: 1px solid #eee;
    font-size: .3rem;
    display: flex;
    align-items: center;
}

.bidNameBox .line {
    /* float: left; */
    width: .1rem;
    height: .38rem;
    background: #7474ec;
    margin: 0 .25rem;
    top: .1rem
}

.bidName {
    display: inline-block;
    font-size: .2rem;
    color: #eba16b;
    border: 1px solid;
    padding: 0.066rem 0.113rem;
    margin-left: .25rem;
    margin-right: 3.55rem
}

.bidNameBox .pull-right {
    font-size: .2rem;
    color: #999
}

.bidNamePrice {
    height: 1.15rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-size: .28rem
}

.bidNamePrice>div {
    text-align: center
}

.bidNamePrice>div span {
    line-height: .5rem
}

.bidNamePrice .line {
    height: .42rem
}

.bidNamePrice .color {
    color: #e50012
}

.moreBtn {
    width: 3rem;
    height: .8rem;
    line-height: .8rem;
    text-align: center;
    margin: .5rem auto .1rem auto;
    background: white;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .3);
}
</style>

